<template>
	<view class="">
		<!-- <view class="head">
			<view class="head-msg dis">
				<view class="head-msg-left">
					<image src="../../../static/logo.png" mode=""></image>
					顺丰:123456786522
				</view>
				<view class="head-msg-right" @click="copy">复制</view>
			</view>
		</view> -->
		<lee-logistics v-if="show == 'slot'" :cardInfo="card" :list="dataList">
			<!-- 卡片插槽 -->
			<!-- <template v-slot:card="{row}">
				<view class="">
					<view>自定义流程内容</view>
					<view class="">物流公司:{{row.type}}</view>
				</view>
			</template> -->
			<!-- 流程插槽 -->
			<template v-slot:process="{row}">
				<view class="">
					<view>{{row.status}}</view>
					<view>{{row.content}}</view>
					<view>时间：{{row.time}}</view>
				</view>
			</template>
		</lee-logistics>
	</view>
</template>

<script>
	import leeLogistics from '@/components/StarLee-logistics/logistics.vue'

	export default {
		components: {
			leeLogistics
		},
		data() {
			return {
				card:{
					src:'https://t10.baidu.com/it/u=996032835,1968172858&fm=58',
					type:'顺丰速递',
					no:'YD34592423445154'
				},
				show: 'slot',
				dataList: [{
						status: '已签收',
						content: '快递员 小陈已将物品配送到目的地 请尽快签收 有问题请联系18888559999',
						time: '2023-05-01 06:20:28'
					},
					{
						content: '[厦门市] 快递到达胜利路胜利街199号',
						time: '2023-05-01 03:10:12'
					},
					{
						content: '[广州市] 快递到达望海镇九五大街转运中心',
						time: '2023-04-29 22:45:28'
					},
					{
						status: '正在揽件',
						content: '包裹正在揽收，快递小哥正在快马加鞭的赶来~',
						time: '2023-04-29 14:18:39'
					},
					{
						status: '已接单',
						content: '包裹正在打包中~',
						time: '2023-04-28 18:50:26'
					}

				]
			}
		},
		methods: {
			copy() {
				uni.setClipboardData({
					data: '1561', //	这里是个坑接受字符串类型 value转化为字符串
					success: () => {
						uni.showToast({
							title: '复制成功',
							duration: 2000,
							icon: 'none'
						});
					}
				});

			}
		}
	}
</script>

<style lang="scss" scoped>
	.head {
		padding: 30rpx;
		background: #fff;
		margin: 20rpx auto;

		.head-msg {
			.head-msg-right {
				color: $maincolor;
			}

			.head-msg-left {

				image {
					width: 30rpx;
					height: 30rpx;
					margin-right: 20rpx;
					vertical-align: middle;
				}
			}

			justify-content: space-between;
			width: 100%;

		}
	}
</style>